<script setup lang="ts">
function gotoHome() {
  uni.switchTab({
    url: "../../pages/Home/Home",
  });
}
</script>
<template>
  <div class="login">
    <div class="logining">
      <div>登录</div>
    </div>
    <div class="login-message">
      <div style="color: #a7a7a7">账号</div>
      <input
        type="text"
        placeholder="请输入注册账号或手机号"
        class="inp-login"
      />
      <div style="color: #a7a7a7; margin-top: 65rpx">密码</div>
      <input type="text" placeholder="请输入登录密码" class="inp-login" />
      <div style="margin-top: 30rpx; color: #5b5b5b; font-size: 28rpx">
        忘记密码？
      </div>
    </div>
    <div class="confirm">
      <button class="button" @click="gotoHome">确定</button>
    </div>
    <div class="deal">
      <radio style="transform: scale(1)" />
      <a href="javascript::" style="font-size: 28rpx; color: #656565"
        >我已阅读并同意《智能充电桩使用协议》</a
      >
    </div>
    <div class="toreg">立即注册</div>
  </div>
</template>
<style lang="less" scoped>
:not(not) {
  box-sizing: border-box;
}
a {
  text-decoration: none;
}
.login {
  padding: 80rpx 40rpx 0;
  .logining {
    font-size: 48rpx;
    font-weight: 500;
    margin-bottom: 90rpx;
  }
  .login-message {
    .inp-login {
      width: 660rpx;
      height: 88rpx;
      font-size: 28rpx;
      line-height: 88rpx;
      margin-top: 30rpx;
      border-radius: 20rpx;
      border: 1px solid #dedede;
    }
  }
  .confirm {
    .button {
      width: 660rpx;
      height: 88rpx;
      color: #fff;
      display: flex;
      justify-content: center;
      align-items: center;
      margin-top: 80rpx;
      background-color: #4f4f4f;
    }
  }
  .deal {
    display: flex;
    align-items: center;
    margin-top: 24rpx;
  }
  .toreg {
    font-size: 28rpx;
    color: #7d7d7d;
    position: absolute;
    bottom: 120rpx;
    left: 320rpx;
  }
}
</style>
